<template>
  <div>
    <el-dialog
      title="编辑管理员"
      :visible.sync="editManageDialog"
      width="35%"
      @close="close"
    >
      <el-form ref="form" :model="formData" label-width="80px">
        <el-form-item label="角色" prop="roleName">
          <el-select v-model="formData.roleId" placeholder="请选择角色">
            <el-option
              v-for="item in roleOption"
              :key="item.roleId"
              :label="item.name"
              :value="item.roleId"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="账号状态">
          <el-radio v-model="formData.status" :label="1">正常</el-radio>
          <el-radio v-model="formData.status" :label="0">锁定</el-radio>
        </el-form-item>
        <el-form-item label="登录名" prop="username">
          <el-input
            placeholder=""
            style="width: 70%"
            v-model="formData.username"
          ></el-input>
        </el-form-item>
        <el-form-item label="密码">
          <el-input
            v-model="formData.password"
            placeholder=""
            style="width: 70%"
          ></el-input>
        </el-form-item>
        <el-form-item label="">
          <el-row :gutter="10">
            <el-button type="primary" size="mini" @click="btnOk"
              >保存</el-button
            >
            <el-button size="mini" @click="close">取消</el-button>
          </el-row>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { updateAdminByIdApi } from "@/api/system";
export default {
  props: {
    editManageDialog: {
      type: Boolean,
    },
  },
  data() {
    return {
      formData: {
        id: "",
        password: "",
        roleId: "",
        status: "",
        username: "",
        roleName: "",
      },
      roleOption: [
        { roleId: 1, name: "超级管理员" },
        { roleId: 2, name: "管理员" },
        { roleId: 3, name: "仑传运营" },
      ],
    };
  },
  created() {
    console.log(this.formData);
  },
  methods: {
    close() {
      this.$emit("update:editManageDialog", false);
    },
    // 点击保存
    async btnOk() {
      try {
        const res = await updateAdminByIdApi({
          id: this.formData.id,
          password: this.formData.password,
          roleId: this.formData.roleId,
          status: this.formData.status,
          username: this.formData.username,
        });
        console.log(res);
        if (res.code === 1) {
          this.$message.success("修改成功");
          this.$emit("update:editManageDialog", false);
          this.$parent.selAdminList();
        } else {
          this.$message.error("修改失败");
        }
      } catch {
        this.$message.error("修改失败");
      }
    },
  },
};
</script>

<style scoped></style>
